<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout">
    <body layout:fragment="modal">

        <div th:id="|${modalId}-container|" class="modal-container" style="display:none;">
            <section th:id="${modalId}" class="modal">
                <header>
                    <h1 th:text="${modalHeader}">My Modal</h1>
                    <div th:id="|close-${modalId}|" class="modal-close">
                        <a href="#close">Close</a>
                    </div>
                </header>
                <div th:id="|${modalId}-content|" class="modal-content">
                    <div layout:fragment="modal-content">
                        <p>My modal content</p>
                    </div>
                </div>
            </section>
        </div>

    </body>
</html>